import React from 'react';
import { View, Text } from 'react-native';
import PropTypes from 'prop-types';

const Section = ({ title, children }) => (
  <View style={{ marginBottom: 50, flexDirection: 'column', alignItems: 'center' }}>
    <View>
      <Text style={{ fontSize: 32 }}>{title}</Text>
    </View>
    <View style={{ marginTop: 20 }}>
      {children}
    </View>
  </View>
);
Section.defaultProps = {
  title: '',
  children: null,
};
Section.propTypes = {
  /**
   * ### Section 属性说明
   *
   * 有标题的节点
   *
   * | Name | Type | Default | Details | isRequired |
   * | ------:| -----------:| -----------: | -----------: | ------:|
   * | title | string | | 标题 | no |
   * | children | object | | 子元素(按钮) |no|
   *
   * ### Section 代码示例(详见示例项目)
   *
   * ```html
   * <Section theme={colors} />
   * ```
   */
  title: PropTypes.string,
  children: PropTypes.instanceOf(Object),
};
export default Section;
